<style lang="scss" scoped>
</style>
<template>
  <div class="set_user_name baseW">
    <!-- 顶部导航 -->
    <van-nav-bar
      title="编辑昵称"
      right-text="保存"
      left-arrow
      @click-left="$router.go(-1)"
      @click-right="onClickRight"
    />
    <van-cell-group>
      <van-field
        class="un"
        v-model="value"
        input-align="right"
        colon
        center
        clickable
        autofocus
        label-width="100px"
        label="昵称/单位昵称"
        placeholder="请输入昵称/单位昵称"
      />
    </van-cell-group>
  </div>
</template>

<script>
import { updateName } from "../../api/user";
import { Toast } from "vant";
export default {
  data: () => ({
    value: "",
  }),
  created(){
    this.value = this.$store.state.userInfo.name;
    console.log(this.$store.state.userInfo.name);
  },
  methods: {
    async onClickRight() {
      let { value } = this;
      if (value) {
        let return_msg = await updateName({ new_name: value });
        if (!return_msg.data.ok) {
          Toast.success("修改成功!");
          this.$store.commit("setUserName", value);
          setTimeout(() => {
            this.$router.go(-1);
          }, 500);
        }
      } else {
        Toast.fail("填写后再保存");
      }
    },
  },
};
</script>